@extends('layouts.app')

@section('content')
    <link rel="stylesheet" href="//g.alicdn.com/de/prismplayer/2.7.2/skins/default/aliplayer-min.css" />
    <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/de/prismplayer/2.7.2/aliplayer-min.js"></script>
    <div class="container course-detail-wrap">
        <div class="am-breadcrumb-wrap">
            <ol class="am-breadcrumb am-breadcrumb-slash am-fl am-margin-bottom-0">
                <li><a href="/">首页</a></li>
                <li><a href="/list/{{ $cate_info->cate_id }}">{{ $cate_info->cate_name }}</a></li>
                <li class="am-active">{{ $video_info->title }}</li>
            </ol>
        </div>
        <div class="course-list-detail">
            <div class="course-list-detail-left">
                <div class="course-list-detail-left-top">
                    <div class="course-list-detail-left-content">
                        <p class="course-list-detail-left-content-tip02">{{ $video_info->title }}</p>
                        <p class="course-list-detail-left-content-tip03">

                        </p>
                        <div class="xue-card-info am-text-sm course-list-detail-left-content-tip04">


                        </div>
                    </div>
                    <div class="prism-player" id="player-con">
                        @if ($has_auth == 0)
                            <img src="https://{{ env('bucket').'.'.env('endpoint').'/'.$video_info->picture }}" width="770"/>
                        @endif
                    </div>
                    @if ($has_auth == 1)
                    <script>
                        var player = new Aliplayer({
                                "id": "player-con",
                                "qualitySort": "asc",
                                "format": "mp4",
                                "mediaType": "video",
                                "width": "100%",
                                "height": "500px",
                                "autoplay": false,
                                "isLive": false,
                                "rePlay": false,
                                "playsinline": true,
                                "preload": true,
                                "controlBarVisibility": "hover",
                                "useH5Prism": true,
                                "vid" : '{{ $video_info->path }}',
                                "playauth" : '{{ $play_auth->PlayAuth }}',
                                "cover": 'http://liveroom-img.oss-cn-qingdao.aliyuncs.com/logo.png',
                            }, function (player) {
                                console.log("播放器创建了。");
                            }
                        );
                    </script>
                    @endif
                    <!--外教展示-->

                </div>
                <div class="course-list-detail-left-bottom">
                    <div class="scroll-box-wrap" id="scroll-box-wrap">
                        <ul>
                            <li class="current"><a href="javascript:;">课程介绍</a></li>
                        </ul>
                    </div>
                    <div class="course-info-box">
                        <div class="course-info-detail">
                            <h3></h3>
                            {!! $video_info->description !!}
                        </div>
                    </div>
                </div>
            </div>
            <div class="course-list-detail-right">
                <div class="course-list-detail-right-pannel01 border-bottom-panel">
                    <div class="course-icon-collect-wrap">
                    </div>
                    <p class="course-continue-price">
                        <span>当前价格:￥</span><strong>{{ $video_info->price }}</strong>
                    </p>
                </div>
                <div class="course-list-detail-right-pannel02 border-bottom-panel">
                    <dl class="all-gifts-wrap">
                        <dt>说明：</dt>
                        <dd>本课程id为{{ $video_info->id }}，通过支付宝或者微信付款后请尽快联系老师，把课程id发给老师，老师会尽快为您开通观看权限。</dd>
                    </dl>
                    <dl class="all-gifts-wrap">
                        <dt>支付宝：</dt>
                        <dd></dd>
                    </dl>
                    <dl class="all-gifts-wrap all-gifts-wrap-statement">
                        <dt>微信：</dt>
                        <dd><img src="https://teach-video.oss-cn-shanghai.aliyuncs.com/files/wxpay.jpg" width="220"/></dd>
                    </dl>
                </div>
                <div class="course-list-detail-right-pannel04">
                    <div class="not-qualified">抱歉您不具备本课程的报名资格</br>详情请咨询<strong class="text-danger">400-800-2211</strong></div>
                    <a class="course-detail-sign-btn" href="http://wpa.qq.com/msgrd?v=3&uin=1441982797&site=qq&menu=yes" target="_blank">联系老师</a>
                </div>
            </div>
        </div>
    </div>
@endsection